<template>
	<view>
	<view class="my-page-content ">
		<view class="my-title">配套设施</view>
		<view class="my-m-title">户内设施</view>
		<view  v-for="(item, index) in formData.indoor" :key="index" class="mb20 flex-between">
			 <span>{{item.label}}</span>
			<label @click="changeChecked(item)" class="radio f28">
				<radio :value="item.checked" backgroundColor="#DCDBDA" color="#FCE353" :checked="item.checked" />
			</label>
		</view>
		<view class="my-m-title">房屋设施</view>
		<view  v-for="(item, index) in formData.room" :key="index" class="mb20 flex-between">
			 <span>{{item.label}}</span>
			<label @click="changeChecked(item)" class="radio f28">
				<radio :value="item.checked" backgroundColor="#DCDBDA" color="#FCE353" :checked="item.checked" />
			</label>
		</view>
		<view class="my-m-title">户外设施</view>
		<view  v-for="(item, index) in formData.outDoor" :key="index" class="mb20 flex-between">
			 <span>{{item.label}}</span>
			<label @click="changeChecked(item)" class="radio f28">
				<radio :value="item.checked" backgroundColor="#DCDBDA" color="#FCE353" :checked="item.checked" />
			</label>
		</view>
		
		
</view>
</view>
</template>

<script>
	export default {
		props: {
			roomTagList: {
				type: Object,
				default () {
					return {}
				}
			}
		},
		data() {
			return {
				  formData: {
					  indoor: [],
					  room: [],
					  outDoor: []
				  },
			}
		},
		mounted() {
			// this.init();
		},
		watch: {
			'roomTagList': {
				handler(n) {
					this.formData = this.roomTagList;
				},
				deep: true,
				immediate: true,
			}
		},
		 methods: {
			 init() {
				 this.getHouseFacility();
			 },
			  getHouseFacility() {
				  // 3: 户内设施 4: 房间设施 5: 户外设施
				this.$http.getHouseFacility().then(res=>{
					res.forEach(item=>{
						this.checkedList.forEach(i =>{
							if(i.tag_id == item.value) {
								item.checked = true;
							}
						})
						item.tag_id = item.value;
						
						if(item.type == 3) {
							this.formData.indoor.push(item);
						} else if(item.type == 4) {
							this.formData.room.push(item);
						}else if(item.type == 5) {
							this.formData.outDoor.push(item);
						}
					})
				});
			  },
			  changeChecked(item) {
				  item.checked = !item.checked;
				  this.$forceUpdate();
			  },
			  nextStep() {
				  let list = [];
				  for(let key in  this.formData) {
					  list.push( ...this.formData[key]);
				  }
				  list = list.filter(item =>  item.checked);
				  if(list.length == 0) {
					  this.$toast('请至少选择1种设置');
					  return false
				  }
				  return this.formData;
			
			}
	},
}
</script>

<style>
</style>